<template>
  <div>
    <input type="text" placeholder="请输入你的任务名称，按回车键确认" v-model="todoText" @keyup.13="add" />
  </div>
</template>

<script>
import { nanoid } from 'nanoid'
export default {
  data () {
    return {
      todoText: '',
    }
  },
  methods: {
    add () {
      if (!this.todoText.trim()) return alert('不能为空')
      this.$bus.$emit("todoAdd", {
        id: nanoid(),
        title: this.todoText,
        compelte: false,
      })
      this.todoText = ''
    },
  },
}
</script>

<style lang="scss" scoped>
div {
  width: 100%;
  height: 30px;
  border: 1px solid #ddd;
  input {
    width: 100%;
    height: 100%;
    padding: 0 5px;
    border: 0;
  }
}
</style>
